
import React from 'react';
import { DatePicker } from 'weaver-mobile';
import WfChooseItem from '../wf-choose-item/index';
import { FormatUtil } from '../../util/pcPublic';
import {controlViewPort} from './../../util/formUtil'

export default class WfDateTime extends React.Component {
    render(){
        const { domKey,detailtype,className,viewAttr,value,onChange,pickerProps={},format={} } = this.props;
        const index = domKey.indexOf("_");
        const fieldid = index>-1 ? domKey.substring(5, index) : domKey.substring(5);
        let mode = "date";
        if(detailtype === 19)
            mode = "time";
        else if(detailtype === 290)
            mode = "datetime"
        let showValue = FormatUtil.convertFormatValue(value, format);
        const el = (
            <WfChooseItem 
                domKey={domKey}
                className={className}
                realValue={value}
                showValue={showValue}
                viewAttr={viewAttr}
            />
        );
        return (
            viewAttr > 1
            ? <DatePicker fieldid={fieldid} mode={mode} value={value} onChange={onChange} {...pickerProps} onVisibleChange = {this.onVisibleChange}>{el}</DatePicker>
            : el
        )
    }

    onVisibleChange = (visiable) => {
        const {fieldAttr} = this.props;
        //明细表中不用考虑缩放问题
        const {isDetail}=fieldAttr;
        if(isDetail)return;
        controlViewPort('/req',visiable)
    }
}